<template>
	<view class="page login">
		<view class="login-content">
			<view class="login-banner">楼宇智控小程序</view>
			<image class="login-logo" src="../../static/logo.jpg" mode=""></image>
			<button class="login-weapp login-button" @click="handleRequest">确认序授权登录</button>
		</view>
	</view>
</template>

<script>
	import getUrlParams from '@/utils/getUrlParams.js';
	import {
		synchro,
		authorize
	} from '@/api/login.js';

	export default {
		data() {
			return {
				checked: false,
				formData: {
					code: ''
				}
			};
		},
		computed: {
			userInfo() {
				return this.$store.state.userInfo;
			},
			isLogin() {
				if (this.$store.state.token) {
					return true;
				} else {
					return false;
				}
			}
		},
		onLoad(query) {
			if (query && query.q) {
				let data = getUrlParams(decodeURIComponent(query.q));
				if (data.code) {
					this.code = data.code;
				}
				this.handleAuthorize();
			} else {
				uni.switchTab({
					url: '/pages/empty/empty'
				});
			}
		},
		methods: {
			handleAuthorize(status = 1, account_id = '') {
				console.log("执行授权需要的", {
					status,
					account_id
				})
				authorize({
					code: this.code,
					status: status,
					account_id: account_id,
				}).then(data => {
					if (status === 2) {
						this.$route("/pages/succeed/succeed")
					}
				}).catch(error => {
					if (status === 2) {

					}
				})
			},
			handeSynchro() {
				synchro(this.code)
					.then(data => {
						console.log('查看数据 ', data, this.userInfo);
						if (data.data) {
							this.handleAuthorize(2, this.userInfo.id);
						} else {
							uni.showToast({
								title: '授权码已失效',
								duration: 2000
							});
						}
					})
					.catch(error => {
						uni.showToast({
							title: '授权码已失效',
							duration: 2000
						});
						console.log('查看错误', error);
					});
			},
			handleRequest() {
				if (this.isLogin) {
					this.handeSynchro();
				} else {
					this.handleLogin();
				}
			},
			handleLogin() {
				let that = this;
				uni.getUserProfile({
					desc: '用于完善用户信息',
					success(user) {
						console.log('user', user);
						userInfo(user);
					}
				});

				function userInfo(user) {
					uni.login({
						provider: 'weixin',
						scopes: 'auth_user',
						success: data => {
							console.log('获得参数', data);
							userLogin(user, data.code);
						}
					});
				}

				function userLogin(user, code) {
					that.$store
						.dispatch('login', code)
						.then((data) => {
							console.log('执行到此处的了不', data.id);
							that.handleAuthorize(2, data.id);
						})
						.catch((error) => {
							console.log("查看错误信息", error)
						});
				}
			}
		}
	};
</script>

<style lang="scss">
	page {
		background-color: #f4f4f4;
		height: 100vh;
	}

	.login-banner {
		text-align: center;
		font-size: 40rpx;
		color: #919191;
		font-weight: 200;
	}

	.login-logo {
		margin: 40rpx auto;
		width: 150rpx;
		height: 140rpx;
	}

	.login-content {
		margin: 32rpx;
		background-color: #fefefe;
		padding: 80rpx 0;
		border-radius: 10rpx; //圆角
		display: flex;
		align-items: center; //垂直居中
		justify-content: center; //水平居中
		flex-direction: column;
	}

	.login-button {
		border: 0;
		overflow: hidden;
		background-color: red;
		height: 80rpx;
		border-radius: 40rpx; //圆角
		color: #ffffff;
		font-size: 28rpx;
		font-weight: 300;
		width: 80%;
		line-height: 80rpx;
		margin: 0 80rpx;
		flex: 1;
		margin-bottom: 28rpx;
	}

	.login-weapp {
		background-color: #4bab40;
	}

	.login-mobile {
		background-color: #3875c6;
	}

	.login-footer {
		padding: 40rpx;
		display: flex;
		align-items: center; //垂直居中
		justify-content: center; //水平居中

		.login-footer-text {
			padding-left: 20rpx;
			font-size: 26rpx;

			text {
				color: #3875c6;
			}
		}
	}
</style>
